<div class="recent-updates">
    <article>
        <h2 class="date">December 1, 2015</h2>
        <a class="toggle-visibility-button" data-hide="Hide" data-show="Show">Hide</a>
        <div class="toggle-visibility-element article-content ">
            <h1>Assignment 1</h1>
            <p>Please submit your first assignment before due date.</p>
        </div>
    </article>
    <article>
        <h2 class="date">December 1, 2015</h2>
        <a class="toggle-visibility-button" data-hide="Hide" data-show="Show">Show</a>
        <div class="toggle-visibility-element article-content">
            <h1>Quiz 1</h1>
            <p>You have a quiz due on coming friday.</p>
        </div>
    </article>
    <article>
        <h2 class="date">November 26, 2015</h2>
        <a class="toggle-visibility-button" data-hide="Hide" data-show="Show">Show</a>
        <div class="toggle-visibility-element article-content hidden">
            <h1>Assignment update</h1>
            <p>Please submit your first assignment before due date.</p>
        </div>
    </article>
</div>
<div class="old-updates hidden toggle-visibility-element">
    <article>
        <h2 class="date">November 20, 2015</h2>
        <a class="toggle-visibility-button" data-hide="Hide" data-show="Show">Show</a>
        <div class="toggle-visibility-element article-content hidden"><h1>Orientation</h1>
            <p>Orientation will held on monday</p>
        </div>
    </article>
    <article>
        <h2 class="date">November 19, 2015</h2>
        <a class="toggle-visibility-button" data-hide="Hide" data-show="Show">Show</a>
        <div class="toggle-visibility-element article-content hidden"><h1>Course starting</h1>
            <p>Starting info about course.</p>
        </div>
    </article>
</div>
<a class="toggle-visibility-button show-older-updates" data-hide="" data-show="Show Earlier Course Updates">
    Show Earlier Course Updates
</a>
